﻿@{
    ViewBag.PageTitle = "我的投稿 - " + ViewBag.site.SeoTitle;
    ViewBag.PageKeyword = ViewBag.site.SeoKeyword;
    ViewBag.PageDescription = ViewBag.site.SeoDescription;
}
<div class="wrapper">
    <div class="account-box">
        @{
            await Html.RenderPartialAsync("_AccountNav", "contribute");
        }
        <div class="right-box">
            <div class="tab-box">
                <div class="menu-box">
                    <div class="item-box active">
                        <span>我的投稿</span>
                    </div>
                </div>
                <div class="btn-box">
                    <el-link :underline="false" icon="el-icon-edit-outline" href="/account/contribute/edit">新增</el-link>
                    <el-link type="danger" :underline="false" @@click="deleteCheckAll" icon="el-icon-delete">删除</el-link>
                </div>
            </div>
            <div class="content">
                <el-table ref="multipleTable" :data="listData" stripe class="table-list" @@selection-change="handleSelectionChange">
                    <el-table-column type="selection" width="45"></el-table-column>
                    <el-table-column label="文章信息" min-width="150">
                        <template slot-scope="scope">
                            <div class="img-list">
                                <div class="img-box">
                                    <el-image :src="common.loadFile(scope.row.imgUrl)" fit="cover"></el-image>
                                </div>
                                <div class="txt-box">
                                    <h4>{{scope.row.title}}</h4>
                                    <span class="info"></span>
                                    <span class="date">
                                        <i class="el-icon-time"></i>
                                        {{scope.row.addTime}}
                                    </span>
                                </div>
                            </div>
                        </template>
                    </el-table-column>
                    <el-table-column label="投搞状态" align="center" width="110">
                        <template slot-scope="scope">
                            <el-tag v-if="scope.row.status==0" type="warning" size="small">待审核</el-tag>
                            <el-tag v-else-if="scope.row.status==1" type="success" size="small">已采纳</el-tag>
                            <el-tag v-else="scope.row.status==2" type="danger" size="small">已退回</el-tag>
                        </template>
                    </el-table-column>
                    <el-table-column label="操作" align="center" width="160">
                        <template slot-scope="scope">
                            <el-button size="mini" icon="el-icon-edit" @@click="common.linkUrl('/account/contribute/edit/'+scope.row.id)"></el-button>
                            <el-button size="mini" type="danger" icon="el-icon-delete" @@click="deleteItem(scope.row.id)"></el-button>
                        </template>
                    </el-table-column>
                </el-table>

                <div class="pager-box">
                    <el-pagination background
                                   @@size-change="handleSizeChange"
                                   @@current-change="handleCurrentChange"
                                   :current-page="pageIndex"
                                   :page-sizes="[10, 20, 50, 100]"
                                   :page-size="pageSize"
                                   layout="total, sizes, prev, pager, next, jumper"
                                   :total="totalCount">
                    </el-pagination>
                </div>

            </div>
        </div>
    </div>
</div>

@section Scripts{
    <script>
        //初始化VUE
        var ve = new Vue({
            el: '#app',
            data: {
                account: {}, //账户信息
                loading: false,
                totalCount: 0,
                pageSize: 10,
                pageIndex: 1,
                listData: [],
            },
            methods: {
                //加载数据
                initData: function () {
                    let _this = this;
                    //获取会员信息
                     AxiosAjax({
                        url: `/account/member`,
                        success: function (res) {
                            _this.account = res.data;
                        }
                    });
                    let sendUrl = `/client/article/contribute?pageSize=${_this.pageSize}&pageIndex=${_this.pageIndex}`;
                     AxiosAjax({
                        url: sendUrl,
                        beforeSend: function () {
                            _this.loading = true
                        },
                        success: function (res) {
                            _this.listData = res.data;
                            let pageInfo = JSON.parse(res.headers["x-pagination"]);
                            _this.totalCount = pageInfo.totalCount;
                            _this.pageSize = pageInfo.pageSize;
                            _this.pageIndex = pageInfo.pageIndex;
                        },
                        error: function (err) {
                            _this.listData = [];
                        },
                        complete: function () {
                            _this.loading = false
                        }
                    });
                },
                //跳转链接
                linkUrl: function (url) {
                    let _this = this;
                    window.location.href = url;
                },
                //多选删除
                deleteCheckAll: function () {
                    //let _parent = this; //父页面
                    let _this = this; //当前页面
                    //判断是否有父窗体
                    //if (typeof (parent.vm) != "undefined") {
                    //    _parent = parent.vm;
                    //}
                    //拿到选中的数据
                    let list = _this.multipleSelection;
                    //检查是否有选中
                    if (!list) {
                        _this.$message({ type: 'warning', message: '请选择要删除的记录！' });
                        return false;
                    }
                    //执行删除操作
                    _this.$confirm('确认要删除该记录吗？', '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    }).then(function () {
                        let delIds = [];//创建一个数组
                        list.forEach((item, index) => {
                            //遍历源数据
                            _this.listData.forEach((v, i) => {
                                if (item.id == v.id) {
                                    delIds.push(item.id);
                                }
                            })
                        });
                        AxiosAjax({
                            method: 'delete',
                            url: `/client/article/contribute?ids=${delIds.toString()}`,
                            loading: true,
                            successMsg: '已删除成功',
                            success: function (res) {
                                _this.initData(); //重新加载列表
                            }
                        })
                    }).catch(function () { });
                },
                //单项删除
                deleteItem: function (val) {
                    //let _parent = this; //父页面
                    let _this = this; //当前页面
                    //判断是否有父窗体
                    //if (typeof (parent.vm) != "undefined") {
                    //    _parent = parent.vm;
                    //}
                    //执行删除操作
                    _this.$confirm('确认要删除该记录吗？', '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    }).then(function () {
                        AxiosAjax({
                            method: 'delete',
                            url: `/client/article/contribute/${val}`,
                            loading: true,
                            successMsg: '已删除成功',
                            success: function (res) {
                                _this.initData();//重新加载列表
                            }
                        });

                    }).catch(function () { });

                },
                //选中第几行
                handleSelectionChange: function (val) {
                    this.multipleSelection = val;
                },
                //每页显示数量
                handleSizeChange: function (val) {
                    if (this.pageSize != val) {
                        this.pageSize = val;
                        this.initData();
                    }
                },
                //跳转到第几页
                handleCurrentChange: function (val) {
                    if (this.pageIndex != val) {
                        this.pageIndex = val;
                        this.initData();
                    }
                }
            },
            mounted() {

            },
            created() {
                //加载数据
                this.initData();
            }
        })
    </script>
}